<template>
  <el-dialog
    v-model="dialogShow"
    :close-on-click-modal="false"
    width="400px"
    title="创建招商规划"
    @closed="close"
  >

    <el-radio v-model="radio" label="1" size="large">创建区域招商规划</el-radio>
    <el-radio v-model="radio" label="2" size="large">创建精细招商规划</el-radio>

    <template #footer>
      <div class="dialog-footer">
        <el-button
          class="border-btn"
          size="small"
          @click="close"
        >取消</el-button>
        <el-button
          class="main-btn"
          size="small"
          type="primary"
          @click="confirm"
        >确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
import {useRouter} from 'vue-router'
import {defineComponent, reactive, toRefs} from 'vue'

export default defineComponent({
  name: 'CreatePlanDialog',
  setup() {
    const router = useRouter()
    var data = reactive({
      dialogShow: false,
      radio: '1',
      id: 0,
    })

    const close = () => {
      data.dialogShow = false
    }

    const confirm = () => {
      if (data.radio == 2) {
        router.push({
          name: 'planAdd',
          query: {
            chance_id: data.id,
          },
        })
      } else {
        router.push({
          name: 'signedPlanAdd',
          query: {
            chance_id: data.id,
          },
        })
      }
      close()
    }

    const openDialog = (id) => {
      data.id = id
      data.dialogShow = true
    }

    return {
      ...toRefs(data),

      close,
      confirm,
      openDialog,
    }
  }
})
</script>

<style scoped>

</style>
